Implementing Permissions for Camera, Location, and Media in React Native

Course: React Native Training

Topic: Implementing Permissions for Camera, Location, and Media

Course Link: React Native Training Course

Demo Link: Register for a Course Demo

Website: JustAcademy Official Website

1. Introduction to Permissions in React Native

Mobile applications often need access to device features such as the camera, location services, photos, videos, and other media files. React Native applications must handle these permissions correctly to protect user privacy and comply with Android and iOS operating-system requirements.

For example, a shopping application may need the camera to capture a product image, location access to find nearby stores, and media access to let users upload an existing photograph. These capabilities should only be requested when they are necessary for a specific feature.

Permission handling involves checking the current permission status, requesting access when appropriate, responding to denial, explaining why access is needed, and providing a fallback when permission is unavailable.

In this tutorial, examples use Expo-compatible React Native libraries. The same concepts apply to bare React Native applications, although native configuration and library APIs may differ.

1.1 What Is a Mobile Permission?

A permission is authorization granted by the user or operating system that allows an application to access a protected resource. Depending on the resource and platform, permission may be requested at runtime, controlled through system settings, or governed by a system-provided interface.

1.2 Why Are Permissions Important?

• Privacy: Protects sensitive information such as photographs and location data.
• Security: Prevents unnecessary access to device hardware and personal information.
• User control: Allows users to grant, deny, or limit access.
• Platform compliance: Helps applications meet Android and iOS permission requirements.
• Reliability: Prevents features from failing unexpectedly when access is unavailable.
• Transparency: Explains why a feature needs a particular permission.

2. Learning Objectives

After completing this topic, learners should be able to:

• Understand runtime permissions in React Native.
• Differentiate camera, location, and media permissions.
• Install and configure Expo permission-related libraries.
• Check and request camera permissions.
• Request foreground location access and retrieve device coordinates.
• Handle photo and video selection permissions.
• Understand Android manifest and iOS usage-description configuration.
• Handle denied, restricted, and limited permissions.
• Guide users to system settings when access cannot be requested again.
• Build a reusable permission-handling workflow.
• Test permission behavior across Android and iOS.

3. Types of Permissions in React Native

Different device features use different permission mechanisms. The exact requirements depend on the platform, operating-system version, library, and requested operation.

4. Understanding Permission Statuses

Before accessing a protected device resource, the application should understand whether permission is granted, denied, or has not yet been requested.

Permission APIs may return additional fields. Do not assume all platforms expose identical permission states or behave the same way after a denial.

5. Setting Up the React Native Project

5.1 Create an Expo Project

If you do not already have a React Native Expo project, create one with the following commands:

npx create-expo-app DevicePermissionsApp
cd DevicePermissionsApp
npx expo start

5.2 Install Required Libraries

Install the libraries used in the examples:

npx expo install expo-image-picker expo-location expo-media-library

Each library supports different operations:

• expo-image-picker opens the system interface to capture a photo or choose media.
• expo-location requests location access and retrieves location information.
• expo-media-library provides broader media-library functionality, such as querying assets and managing media where supported.

Use the libraries required by your application. You do not need to install all three if your app only needs one type of permission.

5.3 Import the Libraries

import * as ImagePicker from 'expo-image-picker';
import * as Location from 'expo-location';
import * as MediaLibrary from 'expo-media-library';

These imports expose the APIs used to request permissions and access the corresponding resources.

6. Implementing Camera Permissions

Camera permission is needed when an application directly accesses the device camera. For example, a custom camera preview or photo-capture workflow requires camera access. Selecting an existing image through a system picker may follow a different permission flow and may not require broad photo-library permission.

6.1 Request Camera Permission

Expo ImagePicker provides methods for checking and requesting camera access.

import * as ImagePicker from 'expo-image-picker';

async function requestCameraPermission() {
  const permission =
    await ImagePicker.requestCameraPermissionsAsync();

  if (permission.granted) {
    console.log('Camera permission granted');
    return true;
  }

  console.log('Camera permission not granted');
  return false;
}

6.2 Explanation

1. Call requestCameraPermissionsAsync() when the user initiates the camera feature.
2. The operating system handles the permission request where applicable.
3. The returned object contains permission information.
4. Check the granted property before accessing the camera.
5. If access is denied, explain the limitation and avoid launching a feature that cannot work.

6.3 Check Camera Permission Without Requesting It

async function checkCameraPermission() {
  const permission =
    await ImagePicker.getCameraPermissionsAsync();

  return permission.granted;
}

Checking permission is useful when displaying feature availability or deciding whether to show an explanatory message. It does not replace requesting permission when access is needed.

6.4 Open the Camera After Permission Is Granted

async function capturePhoto() {
  try {
    const permission =
      await ImagePicker.requestCameraPermissionsAsync();

    if (!permission.granted) {
      console.log('Camera access is required.');
      return;
    }

    const result = await ImagePicker.launchCameraAsync({
      mediaTypes: ['images'],
      allowsEditing: true,
      quality: 0.8,
    });

    if (!result.canceled && result.assets?.length) {
      const photo = result.assets[0];
      console.log('Captured photo URI:', photo.uri);
    }
  } catch (error) {
    console.error('Camera operation failed:', error);
  }
}

The camera must be available on the device, and behavior may differ on emulators, simulators, and web. Test the workflow on the platforms your application supports.

6.5 Camera Permission Configuration

Expo libraries can configure native permissions through their config plugins. For an Expo project using Continuous Native Generation, configure the permission description in the app configuration file.

{
  "expo": {
    "plugins": [
      [
        "expo-image-picker",
        {
          "cameraPermission": "Allow this app to take profile photos.",
          "microphonePermission": false
        }
      ]
    ]
  }
}

This example configures a camera usage message and disables the ImagePicker plugin's microphone permission where supported by its configuration. Do not disable microphone access if the application genuinely needs audio recording.

7. Implementing Location Permissions

Location permission allows an application to access approximate or precise geographic information from the device. Location functionality is commonly used for navigation, maps, delivery tracking, weather, nearby services, and location-based search.

Location access is particularly sensitive because it can reveal a user's movements or home and work locations. Request only the access necessary for the feature, and avoid collecting location data without a clear purpose.

7.1 Types of Location Access

7.2 Request Foreground Location Permission

import * as Location from 'expo-location';

async function requestLocationPermission() {
  const permission =
    await Location.requestForegroundPermissionsAsync();

  if (permission.granted) {
    console.log('Location permission granted');
    return true;
  }

  console.log('Location permission not granted');
  return false;
}

7.3 Retrieve the Current Location

async function getCurrentLocation() {
  try {
    const permission =
      await Location.requestForegroundPermissionsAsync();

    if (!permission.granted) {
      console.log('Location access is required for this feature.');
      return null;
    }

    const location = await Location.getCurrentPositionAsync({});

    return {
      latitude: location.coords.latitude,
      longitude: location.coords.longitude,
    };
  } catch (error) {
    console.error('Unable to retrieve location:', error);
    return null;
  }
}

7.4 Understanding Location Coordinates

A location response typically contains a coords object with properties such as:

• latitude: Position north or south of the equator.
• longitude: Position east or west of the prime meridian.
• accuracy: Estimated accuracy of the position, where available.
• altitude: Estimated height above sea level, where available.
• heading: Direction of travel, where available.
• speed: Estimated speed, where available.

Some properties may be null or unavailable. Location accuracy depends on device hardware, system settings, environment, and the permission level granted by the user.

7.5 Check Location Services

Permission and device location services are different. A user may grant permission while location services are disabled. Check whether the device's location services are enabled when the feature depends on them.

async function checkLocationServices() {
  const enabled = await Location.hasServicesEnabledAsync();

  if (!enabled) {
    console.log('Enable device location services to continue.');
    return false;
  }

  return true;
}

7.6 Foreground Versus Background Location

Use foreground permission for features that need location only while the user is actively using the application. Background location requires additional platform-specific configuration, stronger justification, and may be subject to app-store review or access restrictions.

Do not request background location simply because the app has a map. If a feature only needs a one-time position while the app is open, foreground access is usually the appropriate starting point.

8. Implementing Media Permissions

Media permissions govern access to photos, videos, and other media stored on a device. The exact permission requirements depend on whether the application opens a system picker, queries the media library directly, saves media, or performs another operation.

8.1 Image Picker Versus Media Library

These two approaches should not be confused:

• ImagePicker: Lets the user select an image or video through a system interface. A standard image-selection flow may not require a separate broad media-library permission request.
• MediaLibrary: Supports direct interaction with the media library, such as querying assets or saving and managing media. Permission requirements depend on the operation.

8.2 Open the System Image Picker

import * as ImagePicker from 'expo-image-picker';

async function selectImage() {
  try {
    const result = await ImagePicker.launchImageLibraryAsync({
      mediaTypes: ['images'],
      allowsEditing: true,
      quality: 0.8,
    });

    if (!result.canceled && result.assets?.length) {
      console.log('Selected image:', result.assets[0].uri);
      return result.assets[0];
    }

    return null;
  } catch (error) {
    console.error('Image selection failed:', error);
    return null;
  }
}

For a standard image picker workflow, avoid requesting broad media access unnecessarily. Follow the current library documentation for special cases, such as particular video workflows or operations that require access to the original asset.

8.3 Request Media Library Permission

If your application needs to query or manage the media library directly, use the appropriate permission API.

import * as MediaLibrary from 'expo-media-library';

async function requestMediaPermission() {
  const permission =
    await MediaLibrary.requestPermissionsAsync();

  if (permission.granted) {
    console.log('Media library permission granted');
    return true;
  }

  console.log('Media library permission not granted');
  return false;
}

8.4 Check Media Permission

async function checkMediaPermission() {
  const permission =
    await MediaLibrary.getPermissionsAsync();

  return {
    granted: permission.granted,
    status: permission.status,
    canAskAgain: permission.canAskAgain,
  };
}

Check the current API for optional arguments and platform-specific permission fields. The response may include information about limited access to selected media.

8.5 Handle Limited Photo Access

Modern Android and iOS versions can allow users to grant access to selected photos rather than the entire media library. An application should work with the assets the user has authorized and avoid assuming full access.

When the library API returns an accessPrivileges property, it may indicate all, limited, or none. Check the returned value before assuming that the app can access every item in the library.

9. Android Permission Configuration

Android uses manifest declarations for permissions and runtime requests for many protected resources. Expo libraries often add the permissions they require automatically, but the final application configuration must still be checked.

9.1 Android Manifest

In a bare React Native project, required permissions are generally declared in android/app/src/main/AndroidManifest.xml. For example, camera and location permissions may include:

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

These declarations do not mean the user has granted runtime permission. The application must still request runtime access when required.

9.2 Background Location Permissions

Background location has additional requirements and should be added only if the feature genuinely needs location while the application is not in active use. Android versions impose different restrictions on background access and foreground services.

9.3 Expo Android Configuration

Expo supports Android permission configuration through app configuration. Libraries can automatically add permissions to the native manifest. If a permission is not required, review whether the relevant library configuration or native manifest needs to exclude it.

{
  "expo": {
    "android": {
      "permissions": [
        "android.permission.CAMERA",
        "android.permission.ACCESS_COARSE_LOCATION",
        "android.permission.ACCESS_FINE_LOCATION"
      ]
    }
  }
}

This example illustrates explicit permission declarations. Do not copy every permission into a production app without evaluating whether it is needed; libraries may already add them, and the final manifest should contain only appropriate permissions.

10. iOS Permission Configuration

iOS requires a usage-description message for protected resources such as the camera, photo library, and location. The message explains to the user why the app wants access.

10.1 Common iOS Usage-Description Keys

Use only the keys relevant to the capabilities your application implements. Background location should not be configured unless it is genuinely needed and meets platform requirements.

10.2 Expo Configuration Example

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSCameraUsageDescription": "Allow the app to capture profile photos.",
        "NSPhotoLibraryUsageDescription": "Allow the app to access photos you choose.",
        "NSLocationWhenInUseUsageDescription": "Allow the app to find nearby services."
      }
    }
  }
}

When using an Expo config plugin, configure permissions through the supported plugin properties where possible. Native configuration changes generally require a new native build and cannot be applied simply by refreshing JavaScript.

11. Creating a Reusable Permission Utility

Applications often check permissions in several screens. A reusable utility can keep permission checks consistent and simplify error handling.

11.1 Camera Permission Utility

import * as ImagePicker from 'expo-image-picker';

export async function ensureCameraPermission() {
  try {
    const permission =
      await ImagePicker.getCameraPermissionsAsync();

    if (permission.granted) {
      return { granted: true, canAskAgain: true };
    }

    if (!permission.canAskAgain) {
      return {
        granted: false,
        canAskAgain: false,
      };
    }

    const requested =
      await ImagePicker.requestCameraPermissionsAsync();

    return {
      granted: requested.granted,
      canAskAgain: requested.canAskAgain,
    };
  } catch (error) {
    console.error('Camera permission error:', error);

    return {
      granted: false,
      canAskAgain: false,
    };
  }
}

11.2 Using the Utility

const permission = await ensureCameraPermission();

if (!permission.granted) {
  console.log(
    permission.canAskAgain
      ? 'Camera permission was not granted.'
      : 'Enable camera access in system settings.'
  );
  return;
}

// Continue with the camera workflow.

This utility is a basic example. In a production application, use a clear result type that distinguishes denial, unsupported hardware, configuration errors, and unexpected failures rather than treating every error as a permission denial.

12. Handling Permission Denial

Users may deny access for privacy reasons. The application should continue to work where possible and provide an alternative when the protected feature is unavailable.

12.1 Display an Explanation

import { Alert } from 'react-native';

function showPermissionExplanation(feature) {
  Alert.alert(
    'Permission needed',
    `Access is required to use ${feature}. You can continue without this feature or enable access in settings.`
  );
}

12.2 Open Application Settings

If a user permanently denies permission or the operating system no longer allows another prompt, the app can guide them to settings.

import { Alert, Linking } from 'react-native';

function promptForSettings() {
  Alert.alert(
    'Permission unavailable',
    'You can enable this permission in your device settings.',
    [
      { text: 'Cancel', style: 'cancel' },
      {
        text: 'Open Settings',
        onPress: () => Linking.openSettings(),
      },
    ]
  );
}

Do not open settings automatically without explaining why. Users should understand the action and remain in control.

12.3 Recommended Permission Flow

1. The user taps a feature such as Take Photo or Find Nearby Services.
2. The application checks whether permission is already granted.
3. If permission has not been requested or can be requested again, the app requests it at an appropriate time.
4. If granted, the application proceeds.
5. If denied, the application explains the limitation and offers a useful alternative.
6. If another prompt is not available, the application may offer a settings shortcut.
7. The app checks permission status again when the user returns to the feature.

13. Complete Example: Camera, Location, and Media Permissions

The following example combines camera capture, image selection, and foreground location access in one screen. It demonstrates the permission checks and basic user feedback for each feature.

import { useState } from 'react';
import {
  View,
  Text,
  Button,
  Image,
  Alert,
} from 'react-native';
import * as ImagePicker from 'expo-image-picker';
import * as Location from 'expo-location';

export default function DevicePermissionsScreen() {
  const [imageUri, setImageUri] = useState(null);
  const [coordinates, setCoordinates] = useState(null);

  const takePhoto = async () => {
    try {
      const permission =
        await ImagePicker.requestCameraPermissionsAsync();

      if (!permission.granted) {
        Alert.alert(
          'Camera permission',
          'Allow camera access to take a photo.'
        );
        return;
      }

      const result = await ImagePicker.launchCameraAsync({
        mediaTypes: ['images'],
        allowsEditing: true,
        quality: 0.8,
      });

      if (!result.canceled && result.assets?.length) {
        setImageUri(result.assets[0].uri);
      }
    } catch (error) {
      Alert.alert('Error', 'Unable to open the camera.');
    }
  };

  const chooseImage = async () => {
    try {
      const result = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ['images'],
        allowsEditing: true,
        quality: 0.8,
      });

      if (!result.canceled && result.assets?.length) {
        setImageUri(result.assets[0].uri);
      }
    } catch (error) {
      Alert.alert('Error', 'Unable to open the image picker.');
    }
  };

  const getLocation = async () => {
    try {
      const permission =
        await Location.requestForegroundPermissionsAsync();

      if (!permission.granted) {
        Alert.alert(
          'Location permission',
          'Allow location access to find your current position.'
        );
        return;
      }

      const servicesEnabled =
        await Location.hasServicesEnabledAsync();

      if (!servicesEnabled) {
        Alert.alert(
          'Location services disabled',
          'Enable location services on your device and try again.'
        );
        return;
      }

      const result = await Location.getCurrentPositionAsync({});

      setCoordinates({
        latitude: result.coords.latitude,
        longitude: result.coords.longitude,
      });
    } catch (error) {
      Alert.alert('Error', 'Unable to retrieve your location.');
    }
  };

  return (
    <View>
      <Text>Device Permissions Demo</Text>

      <Button title="Take Photo" onPress={takePhoto} />
      <Button title="Choose Image" onPress={chooseImage} />
      <Button title="Get Current Location" onPress={getLocation} />

      {imageUri && (
        <Image
          source={{ uri: imageUri }}
          style={{ width: 220, height: 220 }}
          resizeMode="cover"
        />
      )}

      {coordinates && (
        <Text>
          Latitude: {coordinates.latitude}
          {'\n'}
          Longitude: {coordinates.longitude}
        </Text>
      )}
    </View>
  );
}

13.1 How the Example Works

• The Take Photo button requests camera access before opening the camera.
• The Choose Image button launches the system picker without automatically requesting broad media-library access.
• The Get Current Location button requests foreground location permission.
• The location workflow checks whether location services are enabled.
• Successful results update React state and appear on the screen.
• Errors are handled with user-friendly alerts.

This is an educational example. A production app should also handle permission denial with a settings option where appropriate, loading states, unsupported devices, location timeouts, and detailed error categories.

14. Background Location Permissions

Background location enables certain applications to access location when the app is not actively displayed. Examples may include navigation, safety, or tracking features that have a legitimate need to continue in the background.

14.1 Request Background Permission

Expo Location provides a background permission API. The exact setup depends on the operating system, native configuration, and platform policies.

import * as Location from 'expo-location';

async function requestBackgroundLocation() {
  const foreground =
    await Location.requestForegroundPermissionsAsync();

  if (!foreground.granted) {
    return false;
  }

  const background =
    await Location.requestBackgroundPermissionsAsync();

  return background.granted;
}

This snippet illustrates the permission sequence, not a complete background tracking implementation. Background location may require additional configuration, a foreground service, user-visible disclosures, and separate review or approval. Do not request it for a feature that only needs location while the app is open.

14.2 Best Practices for Location Access

• Prefer foreground access when it meets the requirement.
• Explain why background location is necessary before requesting it.
• Respect approximate location if precise location is not essential.
• Avoid continuously polling location when a one-time position is enough.
• Protect stored location data and limit retention.
• Provide a clear way to stop location tracking.

15. Common Permission Errors and Troubleshooting

16. Testing Permissions on Android and iOS

Permission testing should include both successful and unsuccessful scenarios. Testing only when permissions are granted is not sufficient for a reliable application.

16.1 Testing Checklist

• Install the app on a supported Android device or emulator.
• Install the app on a supported iOS device or simulator where the feature is available.
• Test the first camera permission request.
• Deny camera access and confirm the fallback behavior.
• Test the gallery picker with and without broad media access where applicable.
• Test limited photo access on supported operating-system versions.
• Test foreground location access.
• Disable location services and confirm that the app handles the condition.
• Test approximate and precise location options where available.
• Test the settings flow after permission denial.
• Reopen the app after changing permissions in system settings.
• Test the production or development build when native configuration changes are made.

16.2 Resetting Permission States

During development, permission decisions can persist between launches. Use the operating system's application settings or reinstall the development app when necessary to test a fresh permission flow. The exact reset process differs by platform and development environment.

17. Privacy and Security Best Practices

Permissions are a privacy boundary, not just a technical requirement. A well-designed application should request only the access needed for the feature and protect the data obtained through that access.

• Request permission in response to a clear user action.
• Explain the feature's purpose before or alongside the system prompt.
• Do not repeatedly request permission after a user has declined.
• Offer alternatives when permission is optional.
• Collect only the location or media data needed for the feature.
• Avoid storing sensitive information longer than necessary.
• Use secure network connections when uploading media or location data.
• Do not log sensitive coordinates, image details, or private file URIs unnecessarily.
• Keep permission messages accurate and specific.
• Review permissions introduced by third-party dependencies.
• Provide a clear way to stop any ongoing location feature.
• Verify backend authorization before storing or sharing uploaded files.

18. Common Mistakes to Avoid

• Requesting all permissions immediately when the application launches.
• Assuming that declaring a permission in the native manifest automatically grants it.
• Assuming that camera, location, and media permissions share the same API.
• Requesting broad photo-library access when the system picker is sufficient.
• Requesting background location for a foreground-only feature.
• Ignoring canAskAgain when permission requests are no longer available.
• Failing to check whether location services are enabled.
• Assuming the user always grants precise location.
• Assuming every selected media item is available to the application indefinitely.
• Changing native configuration without rebuilding the app.
• Failing to test permission denial and recovery flows.
• Displaying vague permission messages that do not explain the feature.

19. Mini Project: Device Permission Manager

19.1 Project Objective

Build a React Native application that demonstrates camera, location, and media permission handling. The app should explain each permission, request access only when the corresponding feature is used, and display clear feedback about the result.

19.2 Functional Requirements

1. Create a home screen with separate Camera, Location, and Media actions.
2. Request camera permission when the user chooses to take a photo.
3. Allow the user to select a photo through the system image picker.
4. Request foreground location access when the user requests their current location.
5. Check whether location services are enabled.
6. Display coordinates only when a location result is available.
7. Handle permission denial without crashing the app.
8. Offer a settings shortcut when appropriate.
9. Display loading and error states.
10. Test the app on Android and iOS.

19.3 Suggested Folder Structure

DevicePermissionsApp/
  App.js
  components/
    PermissionCard.js
    PermissionMessage.js
  services/
    cameraPermissionService.js
    locationPermissionService.js
    mediaPermissionService.js
  utils/
    permissionHelpers.js

19.4 Development Steps

1. Create the Expo project and install the required libraries.
2. Configure permission descriptions in the app configuration.
3. Create a reusable UI component for each permission-based feature.
4. Implement camera permission checking and photo capture.
5. Implement image selection through the system picker.
6. Implement foreground location access and display coordinates.
7. Add denial and settings guidance.
8. Test granted, denied, limited, and unavailable states.
9. Review the final native permissions to ensure no unnecessary access is requested.

20. Interview Questions and Answers

Q1. What are permissions in React Native?

Permissions are authorizations that allow an application to access protected device resources, such as the camera, location, and media library.

Q2. Why are runtime permissions necessary?

They give users control over sensitive device capabilities and allow the operating system to restrict access until authorization is granted.

Q3. How can camera permission be requested in Expo?

Use ImagePicker.requestCameraPermissionsAsync() for Expo ImagePicker camera workflows or the corresponding permission API provided by the camera library being used.

Q4. Which library can be used for location access?

The Expo expo-location library provides APIs for location permissions, current coordinates, and location updates.

Q5. What is the difference between foreground and background location?

Foreground location is used while the app is actively in use. Background location allows eligible features to access location while the app is backgrounded, subject to additional configuration and restrictions.

Q6. What is the difference between ImagePicker and MediaLibrary?

ImagePicker provides a system interface for choosing or capturing media. MediaLibrary supports broader access to the device's media collection, including querying or managing assets where permitted.

Q7. What does canAskAgain mean?

It indicates whether the application can request that permission again through the permission API. If false, the app may need to direct the user to system settings.

Q8. What is limited photo-library access?

It allows the user to authorize access to selected photos rather than the entire media library on supported platforms.

Q9. Why are iOS usage-description keys required?

They explain why the application wants to access protected resources such as the camera, photo library, or location.

Q10. Does adding an Android permission to the manifest grant access?

No. Manifest declarations identify permissions the application may need. Runtime authorization is still required for protected resources where Android mandates it.

Q11. Why might a permission configuration change require a rebuild?

Native permission declarations and usage-description strings are included in the native application binary. A new build is generally required after changing such configuration.

Q12. What should happen if the user denies permission?

The application should handle the denial gracefully, explain which feature is unavailable, and offer an alternative or settings guidance when appropriate.

Q13. Why should background location be requested carefully?

Background location can expose sensitive movement information and has additional technical and platform-policy requirements. It should be requested only when essential.

Q14. How should permission functionality be tested?

Test first-time prompts, granted access, denial, limited access, settings changes, disabled location services, and behavior on supported Android and iOS versions.

21. Practical Exercises

1. Create a button that requests camera permission and displays the result.
2. Implement a camera capture workflow with cancellation handling.
3. Open the image picker and preview a selected photograph.
4. Request foreground location access and display latitude and longitude.
5. Handle the situation when device location services are disabled.
6. Create an explanation screen before requesting sensitive permissions.
7. Add a settings shortcut for permissions that cannot be requested again.
8. Configure appropriate camera, photo, and location usage descriptions.
9. Test limited media access on a supported device.
10. Build a reusable permission manager with consistent error handling.

22. Quick Revision Checklist

• Understand the purpose of runtime permissions.
• Use the correct library for camera, location, or media access.
• Check permission status before using a protected resource.
• Request access only when the user needs the feature.
• Handle denial, cancellation, and unexpected errors.
• Distinguish media picking from direct media-library access.
• Use foreground location unless background access is essential.
• Configure Android manifest permissions and iOS usage descriptions as required.
• Rebuild the native app after relevant build-time configuration changes.
• Test permission behavior on physical devices and supported emulators.
• Protect personal location and media data.
• Review third-party dependencies for unnecessary permissions.

23. Conclusion

Implementing camera, location, and media permissions correctly is an essential part of building secure and reliable React Native applications. Developers should understand the differences between permission types, use appropriate libraries, configure native settings, and handle permission denial gracefully.

By requesting access only when needed, explaining the purpose of each permission, respecting limited access, and testing across Android and iOS, developers can create a better user experience while protecting personal data.

To continue learning, visit the JustAcademy React Native Training Course or register for a course demo.

24. Additional Learning Resources

• Expo Permissions Guide
• Expo ImagePicker Documentation
• Expo Location Documentation
• Expo MediaLibrary Documentation
• Expo Camera Documentation
• React Native Android Permissions API
• JustAcademy React Native Training Course
• JustAcademy Course Demo Registration
• JustAcademy Official Website